<%@page import="org.apache.jasper.tagplugins.jstl.core.ForEach"%>
<%@page import="com.wanmait.cookbook.vo.IngredientsType"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%String path = request.getContextPath(); %>
<jsp:include page="/manage/inc/head.jsp"></jsp:include>
<jsp:include page="/manage/inc/menu.jsp"></jsp:include>
    <!--/sidebar-->
    <div class="main-wrap">

        <div class="crumb-wrap">
            <div class="crumb-list"><i class="icon-font"></i><a href="/jscss/admin/design/">首页</a><span class="crumb-step">&gt;</span><a class="crumb-name" href="<%=path%>/FoodManageServlet?action=getAllIngredientsType">食材管理</a><span class="crumb-step">&gt;</span><span>新增食材</span></div>
        </div>
        <div class="result-wrap">
            <div class="result-content">
                <form action="<%=path %>/FoodManageServlet?action=addIngredientsTypeSecondSql" method="post" id="myform" name="myform" enctype="multipart/form-data">
                    <table class="insert-tab" width="100%">
                        <tbody><tr>
                            <th width="120"><i class="require-red">*</i>类型：</th>
                            <td>
                            	<select name="type" id="catid" class="required">
                            <%List<IngredientsType> ingredientsTypes = (List<IngredientsType>)request.getAttribute("ingredientsTypes");
                            	for(int i=0;i<ingredientsTypes.size();i++){
                            %>
                                    <option  value="<%=ingredientsTypes.get(i).getId()%>"><%=ingredientsTypes.get(i).getTitle() %></option>
                            <%} %> 
                                </select>
                            </td>
                        </tr>
                            <tr>
                                <th><i class="require-red">*</i>食材名称：</th>
                                <td>
                                    <input class="common-text required" id="title" name="title" size="50" type="text">
                                    <span id="sp" style="color:red"></span>
                                </td>
                            </tr>
                            <tr>
                                <th width="120"><i class="require-red">*</i>热门：</th>
                                <td>
                                	<select name="hot" id="hotid" class="required">
                                   		<option  value="1">热门</option>
                                   		<option  value="0">非热门</option>
                                   </select>
								</td>
                            </tr>
                            <tr>
                                <th><i class="require-red">*</i>图片：</th>
                                <td>
                                	<input name="pic" onchange="changepic(this)"  id="pic" type="file">
                                	<span id=sppic style="color:red"></span><br>
                                	<img src="" id="show" width="200">
                                </td>
                            </tr>
                            <tr>
                                <th></th>
                                <td>
                                    <input id="sub" class="btn btn-primary btn6 mr10" value="提交" type="button">
                                    <input class="btn btn6" onclick="history.go(-1)" value="返回" type="button">
                                </td>
                            </tr>
                        </tbody></table>
                </form>
            </div>
        </div>

    </div>
    <!--/main-->
    <jsp:include page="/manage/inc/foot.jsp"></jsp:include>
    <script>
    $(function(){
    	$("#sub").click(function(){
    		var title =$("#title").val();
    		//判断食材名称为空
    		if(title==""){
    			$("#title").select();
    			$("#sp").html("不能为空");
    			return;
    		}else{
    			$("#sp").html("");
    		}
    		
    		//判断图片不能为空
    		var pic =$("#pic").val();
    		if(pic==null||pic==""){
    			$("#sppic").html("图片不能为空");
    			return;
    		}
    		else{
    			$("#sppic").html("");
    		}
    		$("#myform").submit();
    	});
    });
    
    
    
    function changepic() {
        var reads= new FileReader();
        f=document.getElementById('pic').files[0];
        reads.readAsDataURL(f);
        reads.onload=function (e) {
            document.getElementById('show').src=this.result;
        };
    }
    </script>